<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="com.yaodian100.core.common.utils.ServerValue"%>    
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@taglib prefix="pu" uri="/WEB-INF/tld/pageutil.tld" %>
<%@taglib prefix="mu" uri="/WEB-INF/tld/mallutil.tld" %>
<%@taglib uri="http://java.sun.com/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jstl/core_rt" prefix="c-rt"%>
<%@taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt-rt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@taglib uri="/WEB-INF/tld/importTag.tld" prefix="import" %>
<style> 
.promo-popup{padding:10px;*padding:10px 0 10px 8px; color:#666;line-height:1.4em; }
.promo-popup h2,.promo-popup h3{font-size:15px;color:#d12e6f; margin-bottom:.8em;}
.promo-popup h3{color:#666;}
.promo-popup p{margin:.5em 0;}
.promo-popup .d-line{background:url(/images/link_dote.gif) repeat-x scroll 0 50%; padding:1px 0;}
.promo-popup ol,.promo-popup ul{margin-bottom:1em;margin-left:2em;}
.promo-popup li{list-style:decimal;}
</style>
<script src="/js/pageable.js"></script>
${pu:reqSet('order', pu:get('com.yaodian100.ec.order.entity.Orders', param.orderId)) }
<script>
$(function(){ 
	$('#current_location').html(' > 变更收货人信息');
}); 
</script>
<c-rt:if test="${order.memberId==mu:memberId()}">
<script>
$().ready(function(){
	$("#contactNameTip").hide();
	$("#mobileTip").hide();
	$("#storeAreaTip").hide();
	$("#storeImageTip").hide();
	$("#showDaphne").hide();
	
	$("#storeArea").children().each(function(){
		var storeAreaInit=$("#storeAreaInit").val();
	    if ($(this).text()==storeAreaInit){
	        $(this).attr("selected","true"); //或是給selected也可
	        storeAreaSelected(storeAreaInit);
	    }
	});
	
	 $("#storeArea").change(function() {
		    $("#imagePreview").html("<img src='/images/daphne/000.gif'>");
			$("#pickStore").html("");
	        var storeArea = $("option:selected", this).val();
			$.post("<%=ServerValue.getFrontContextPath()%>/shopping/orderInfo/findDaphnes.do",{storeArea:storeArea},callback,"json");
			function callback(actionResult){
				if(actionResult!=null){
					    var arr_text = actionResult.split("$");										
					var options = '<option value="">请选择</option>';
					 for(i=0;i<arr_text.length;i++)
					 {
						 v=arr_text[i].split(",");
						options += '<option value="' + v[0] + '">' + v[1] + '</option>';
					}
					$("#storeImage").html(options);
					$('#storeImage option:first').attr('selected', 'selected');
				}	
			}
			if($("#storeArea").find('option:selected').text()=="请选择"){
				var options = '<option value="">请选择</option>';
				$("#storeImage").html(options);
			}
			
	   });	

		function storeAreaSelected(storeAreaInit){
			 var storeArea = storeAreaInit;
			 var storeId =$("#storeId").val();
				$.post("<%=ServerValue.getFrontContextPath()%>/shopping/orderInfo/findDaphnes.do",{storeArea:storeArea},callback,"json");
				function callback(actionResult){
					if(actionResult!=null){
					    var arr_text = actionResult.split("$");										
						var options = '<option value="">请选择</option>';
						 for(i=0;i<arr_text.length;i++)
						 {
							 v=arr_text[i].split(",");
									if(storeId == v[0]){
										options += '<option value="' + v[0] + '" selected="selected">' + v[1] + '</option>';
									}else{
										options += '<option value="' + v[0] + '">' + v[1] + '</option>';	
									}	
								
						}
						$("#storeImage").html(options);
						if(storeId == ""){
							$('#storeImage option:first').attr('selected', 'selected');
						}else{
							$("#imagePreview").html(storeId ? "<img src='/images/daphne/" + storeId + ".jpg'>" : "<img src='/images/daphne/000.gif'>");
							$("#pickStore").html("上海市，"+$("#storeArea").find('option:selected').text()+"，"+$("#storeImage").find('option:selected').text());
							$("#addr").val($("#storeImage").find('option:selected').text());
							$("#district").val($("#storeArea").find('option:selected').text());
						}
					}	
				}
		}

	 $("#storeImage").change(function() {
		var tmpstoreArea=$("#storeArea").find('option:selected').text();
		 var storeId = $("option:selected", this).val();
		$("#imagePreview").html(storeId ? "<img src='/images/daphne/" + storeId + ".jpg'>" : "<img src='/images/daphne/000.gif'>");
		if($("option:selected", this).text()=="请选择"){
			$("#pickStore").html("未选取");
			$("#addr").val("");
		}else{
			$("#pickStore").html("上海市，"+tmpstoreArea+"，"+$("option:selected", this).text());
			$("#addr").val($("option:selected", this).text());
		}
		$("#district").val(tmpstoreArea);
		$("#storeId").val(storeId);
	 });	
	 	
	 if($("#addr").val()!='' && $("#addr").val()!='(请选择门市地址)'){
			$("#addr").val($("#storeImage").find('option:selected').text());
			$("#district").val($("#storeArea").find('option:selected').text());
	  }
		
	  
	  if(${order.paymentTp} == '50' && ${order.orderSt} =='10'){
		$("#showDaphne").show();
	  }else{
		  $("#showDaphne").hide();
	  }
	
	$("#go_next").click(function() {
		$("#contactNameTip").hide();
		$("#mobileTip").hide();
		$("#storeAreaTip").hide();
		$("#storeImageTip").hide();
		if($("#contactName").val()==""){
			$("#contactNameTip").show();
			return false;
		}	
		if($("#mobile").val()==""){
			$("#mobileTip").show();
			return false;
		}	
		if($("#storeArea").find('option:selected').text()=="请选择"){
			$("#storeAreaTip").show();
			return false;
		}
		if($("#storeImage").find('option:selected').text()=="请选择"){
			$("#storeImageTip").show();
			return false;
		}
			$("#modAddresDaphneForm").submit();
			return false;
	});
});
</script>
<s:form action="orderMod/modAddresExe.do" id="modAddresDaphneForm" name="modAddresDaphneForm" method="post">
<input type="hidden" name="orderId" value="${order.orderId}"/>
  <!-- content start -->
  <div class="content order-modify">
    <!-- 我的訂單 -->
    <h2>变更收货人信息</h2>
    <div class="d-show">
      <p><strong>当前的收货人信息：</strong></p>
      <ul>
        <li class="w-1of1"><strong>姓 名：</strong>${order.receiverName}</li>
        <li class="w-1of1"><strong>手机号码：</strong>${order.receiverMobile}</li>
        <li class="w-1of1"><strong>固定电话：</strong>${order.receiverPhoneArea}-${order.receiverPhone}-${order.receiverExt} </li>
        <li class="w-1of1">
          <div><strong>地 址：</strong></div>
          <div>${order.receiverProvince}，${order.receiverCity}，${order.receiverArea}，${order.receiverAddr}，${order.receiverZip}
          <c-rt:if test="${order.paymentTp != '50' || order.orderSt !='10'}">
           <span class="txt-rd">(不可修改)</span>
          </c-rt:if> 
          </div>
        </li>
      </ul>
      <p class="c-f" style="border-bottom:1px solid #ccc; height:10px; margin:15px 0;">&nbsp;</p>
      <p><strong>变更收货人信息：</strong></p>
      <div class="consignee">
        <ul>
          <li class="w-1of1">
            <label for="name"><span class="txt-rd">*</span> <strong>姓    名：</strong></label>
            <span>
             <input type="text" name="contactName" id="contactName" value="${order.receiverName}" maxlength="20" size="16"/>
          </span> <br /><span id="contactNameTip" class="msg rn" style="margin-left:4.3em;*margin-left:4.8em; _margin-left:2.5em; ">请填写姓名</span>  
          </li>
            		<input type="hidden" id="province" name="province" value="上海"/>
                    <input type="hidden" id="city" name="city" value="上海市"/>
                    <input type="hidden" id="district" name="district" value=""/>
                    <input type="hidden" id="zipCode" name="zipCode" value=""/>
                    <input type="hidden" id="addr" name="addr" value=""/>
               		<input type="hidden" id="storeId" name="storeId" value="${order.storeId}"/>
               		<input type="hidden" id="storeAreaInit" name="storeAreaInit" value="${storeAreaInit}"/>
          <li class="w-1of1">
            <label for="tel"><strong>&nbsp;&nbsp; 固定电话：</strong></label>
            <span>
              <input type="text" name="areaCode" id="areaCode" value="${order.receiverPhoneArea}" size="5" maxlength="4"/>-
		    <input type="text" name="phone" id="phone" value="${order.receiverPhone}" size="10" maxlength="10" maxlength="8"/>- 分机
 				<input type="text" name="extension" id="extension" value="${order.receiverExt}" size="4" maxlength="8"/>
            </span>
          </li>
          <li class="w-1of1"><span class="txt-rd">*</span> <strong>手机号码：</strong>
           <input type="text" name="mobile" id="mobile"  value="${order.receiverMobile}" size="18" maxlength="11"/>
           <span class="txt-ss">&nbsp;(<span class="txt-rd">*</span>货到时，系统将以email及短信通知您取货时间。)</span> 
             <br />
             <span id="mobileTip" class="msg rn" style="margin-left:5.6em;*margin-left:5.9em;_margin-left:2.9em; ">请填写手机号码</span>
              <br />
          </li>
          <div id="showDaphne" style="display: none">
          <c-rt:choose>
		          	 <c-rt:when test="${(order.paymentTp == '30' || order.paymentTp == '60') && order.orderSt =='00'}">
		          <li class="w-1of1"><div><span class="txt-rd">*</span> <strong>达芙妮门店取货：</strong></div>
		          <div>
		            <p><strong>区域：</strong>
		             <select name="storeArea" id="storeArea">
		              <option value="">请选择</option>
		              <option value="卢湾区">卢湾区</option>
						<option value="普陀区">普陀区</option>
						<option value="青浦区">青浦区</option>
						<option value="松江区">松江区</option>
						<option value="宝山区">宝山区</option>
						<option value="长宁区">长宁区</option>
						<option value="虹口区">虹口区</option>
						<option value="黄浦区">黄浦区</option>
						<option value="闵行区">闵行区</option>
						<option value="南汇区">南汇区</option>
						<option value="闸北区">闸北区</option>
						<option value="奉贤区">奉贤区</option>
						<option value="金山区">金山区</option>
						<option value="嘉定区">嘉定区</option>
						<option value="杨浦区">杨浦区</option>
						<option value="静安区">静安区</option>
						<option value="浦东新区">浦东新区</option>
						<option value="徐汇区">徐汇区</option>
		            </select>
		            <br />
		            <span id="storeAreaTip" class="msg rn" style=" margin-left:3.5em;*margin-left:3.75em;_margin-left:1.87em">请选择区域</span><br />
		            </p>
		          <p>
		            <strong>地址：</strong>
		             <select name="storeImage" id="storeImage">
		              <option value="">请选择</option>
		            </select><br/>
		           <span id="storeImageTip" class="msg rn" style=" margin-left:3.5em;*margin-left:3.75em;_margin-left:1.87em">请选择地址</span>
		            </p>
		          <p>
		           <br />
		           <strong>取货门店：</strong>
		             <span id="pickStore">未选取</span><br />
					<span id="imagePreview">
					   <img src="/images/daphne/000.gif" />
					</span>		
		            </p>
		          </div>
		          </li>
           </c-rt:when>
				         <c-rt:when test="${order.paymentTp == '50' && order.orderSt =='10'}">
				          <li class="w-1of1"><div><span class="txt-rd">*</span> <strong>达芙妮门店取货：</strong></div>
		          <div>
		            <p><strong>区域：</strong>
		             <select name="storeArea" id="storeArea">
		              <option value="">请选择</option>
		              <option value="卢湾区">卢湾区</option>
						<option value="普陀区">普陀区</option>
						<option value="青浦区">青浦区</option>
						<option value="松江区">松江区</option>
						<option value="宝山区">宝山区</option>
						<option value="长宁区">长宁区</option>
						<option value="虹口区">虹口区</option>
						<option value="黄浦区">黄浦区</option>
						<option value="闵行区">闵行区</option>
						<option value="南汇区">南汇区</option>
						<option value="闸北区">闸北区</option>
						<option value="奉贤区">奉贤区</option>
						<option value="金山区">金山区</option>
						<option value="嘉定区">嘉定区</option>
						<option value="杨浦区">杨浦区</option>
						<option value="静安区">静安区</option>
						<option value="浦东新区">浦东新区</option>
						<option value="徐汇区">徐汇区</option>
		            </select>
		            <br />
		            <span id="storeAreaTip" class="msg rn" style=" margin-left:3.5em;*margin-left:3.75em;_margin-left:1.87em">请选择区域</span><br />
		            </p>
		          <p>
		            <strong>地址：</strong>
		             <select name="storeImage" id="storeImage">
		              <option value="">请选择</option>
		            </select><br/>
		           <span id="storeImageTip" class="msg rn" style=" margin-left:3.5em;*margin-left:3.75em;_margin-left:1.87em">请选择地址</span>
		            </p>
		          <p>
		           <br />
		           <strong>取货门店：</strong>
		             <span id="pickStore">未选取</span><br />
					<span id="imagePreview">
					   <img src="/images/daphne/000.gif" />
					</span>		
		            </p>
		          </div>
		          </li>
				         </c-rt:when>
				       <c-rt:otherwise>
				          
				       </c-rt:otherwise>
		          	</c-rt:choose>
        </ul>
        <p class="c-f" align="center"><br />    
           <a id="go_next"  href="javascript:;" class="btn-mid">继续</a> 
 		<a href="<%=ServerValue.getFrontContextPath()%>/member/order/page.do?page=detail&orderId=${order.orderId}" class="btn-mid">回订单页</a>
 		</p>
        </div>
      </div>
      <!-- 我的訂單 -->
    </div>
     </s:form>
</c-rt:if>
<c-rt:if test="${order.memberId!=mu:memberId()}">
您无权查看本订单
</c-rt:if>